import React, {Component} from 'react';
import {
    Flex,
    Icon,
    Tabs,
    NavBar,
    Popover,
    WingBlank,
    WhiteSpace,
    ActionSheet,
    Carousel,
    Modal,
    Grid,
    List,
    Button,
    Toast,
} from 'antd-mobile';
import { connect } from 'dva';
import Moment from 'moment';
import NoLazyImg from '../../components/NoLazyImg/NoLazyImg';
import NavTopBar from '../../components/NavTopBar/NavTopBar';
import MyListView from '../../components/MyListView/MyListView';
import {routerRedux} from "dva/router";
import {distribution,distributionSearch,tianjiaGoods,myStorea} from './distribution.less';
import DistributionItem from "./distributionItem";
import updown1 from '../../assets/svg/updown1.svg';
import updown2 from '../../assets/svg/updown2.svg';
import updown3 from '../../assets/svg/updown3.svg';
import storeShare from '../../assets/svg/storeShare.svg';
import {goto_search_title} from "../search/GotoSearch.less";
import {fenlei, noguanzhu} from "../find/findIndex.less";
import {goods_search_header} from "../search/GoodsSearch.less";
import {myHead, myHeadTwo} from "../my/myHeader.less";
import {wxShare} from "../../utils/weixinShare";
import {IMAGE_DOMAIN} from "../../utils/common";

const Item = Popover.Item;




class MyTeam extends Component {
    constructor(props){
        super(props);
        this.state={
            modal:false,
            value:"",
        };

        this.AlloyTouch = null;

    }

    componentDidMount(){
        this.refresh();

    }

    refresh = () => {
        return this.props.dispatch({ type: 'distribution/myTeamDetailEFF',obj:{pageNo:1 } });
    }

    loadMore = () => {
        return this.props.dispatch({ type: 'distribution/myTeamDetailEFF', obj:{pageNo:this.props.distribution.pageNo+1} });
    }

    getAlloyTouch = (AT) =>{
        this.AlloyTouch = AT;
    };



    render() {
        const {dispatch,distribution} = this.props;
        const {myTeamList,entity={}} = this.props.distribution;
        return ( <Flex direction="column" className={distributionSearch} style={{height:"100%" ,position:'relative',}}>
                <NavTopBar title="我的团队" dispatch={this.props.dispatch}/>
                {entity.storeName? <div style={{width:"100%"}}>
                    <WingBlank>
                        <Flex style={{padding:".3rem 0"}}>
                            <div style={{background:"#ff0036",width:".05rem",height:".35rem",marginRight:".1rem"}}></div>
                            <div style={{fontSize:".35rem"}}>我的推荐人</div>
                        </Flex>
                        <div style={{background:"#fff"}}>
                            <WingBlank >
                                <div style={{padding:".3rem 0",borderBottom:"1px solid #e5e5e5"}}>{entity.memberName }</div>
                                <Flex style={{padding:".3rem 0"}} onClick={()=>{
                                    this.props.dispatch(routerRedux.push({
                                        pathname:`/myStore/${entity.memberId }`
                                    }))
                                }}>
                                    <div style={{width:"1rem",height:"1rem",borderRadius:"100%",marginRight:".2rem"}}>
                                        <NoLazyImg src={entity.myStoreLabel ?entity.myStoreLabel:""} style={{width:"100%",height:"100%"}}></NoLazyImg>
                                    </div>
                                    <div>{entity.storeName }</div>
                                </Flex>
                            </WingBlank>
                        </div>
                    </WingBlank>
                </div>:""}
                {myTeamList[0]?<div style={{width:"100%"}}>
                    <WingBlank>
                        <Flex style={{padding:".3rem 0"}}>
                            <div style={{background:"#ff0036",width:".05rem",height:".35rem",marginRight:".1rem"}}></div>
                            <div style={{fontSize:".35rem"}}>我的团员</div>
                        </Flex>
                    </WingBlank>
                        <MyListView
                            style={{height:"100%"}}
                            getAlloyTouch={ this.getAlloyTouch }
                            refresh={ this.refresh }
                            loadMore={ this.loadMore }
                            hasMore={ this.props.distribution.pageNo * this.props.distribution.pageSize < this.props.distribution.totalRows  }
                            // itemWrapperClass={ goods_list }
                            // bottomStyle={ layoutType == true ? {} : { marginTop:"0.2rem", paddingTop:'0rem' } }
                            renderItem={(v,i,a)=>{
                                return <WingBlank key={i} style={{marginBottom:".2rem"}}>
                                    <div style={{background:"#fff"}}>
                                        <WingBlank >
                                            <Flex justify="between" style={{padding:".3rem 0",borderBottom:"1px solid #e5e5e5"}}>
                                                <div>{v.memberName }</div>
                                                <div style={{color:"#999"}}>加入团队时间 ：{Moment(v.createTime ).format('YYYY-MM-DD')}</div>
                                            </Flex>
                                            <Flex style={{padding:".3rem 0"}} onClick={()=>{
                                                this.props.dispatch(routerRedux.push({
                                                    pathname:`/myStore/${v.memberId }`
                                                }))
                                            }}>
                                                <div style={{width:"1rem",height:"1rem",borderRadius:"100%",marginRight:".2rem"}}>
                                                    <NoLazyImg src={v.myStoreLabel ?v.myStoreLabel:""} style={{width:"100%",height:"100%"}}></NoLazyImg>
                                                </div>
                                                <div>
                                                    <div style={{marginBottom:".2rem"}}>{v.storeName }</div>
                                                    <div>最近消费时间 ：{Moment(v.orderTime).format('YYYY-MM-DD  h:mm:ss')}</div>
                                                </div>
                                            </Flex>
                                        </WingBlank>
                                    </div>
                                </WingBlank>
                            }}
                            data={ myTeamList }>
                        </MyListView>
                </div>:""}

            </Flex>

        )


    }
}

export default connect(({ distribution }) => ({ distribution}))(MyTeam);